<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<script type="text/javascript">
$(function() {
	
	var urlPrefix = "${pageContext.request.contextPath}/api/";
	var images = new Array(5);
	var imageLoadCount = 0;
	var memberData = {};
	var memberLoginName = "<s:property value='memberLoginName' />";
	var memberAPI = new MemberAPI({urlPrefix : urlPrefix});
	
	//for debug
	try{throw ''} catch(e){}
	
	initialize();
	
	function initialize() {
	    memberAPI.detail({
			onSuccess : function(data) {
			    memberData = data.member;
			    imageLoadCount = 0;
            	images = new Array(5);
            	
        		$('#member_detail_container #member_login_name').text(memberData.member_login_name);
            	$('#member_detail_container #enterprise_name').text(memberData.enterprise_name);
            	$('#member_detail_container #enterprise_property').text(memberData.enterprise_property_name);
            	$('#member_detail_container #enterprise_category').text(memberData.enterprise_category_name);
            	$('#member_detail_container #contact_name').text(memberData.contact_name);
            	$('#member_detail_container #contact_certificates_no').text(memberData.contact_certificates_no);
            	$('#member_detail_container #telephone').text(memberData.telephone);
            	$('#member_detail_container #mobile').text(memberData.mobile);
            	$('#member_detail_container #email').text(memberData.email);
            	$('#member_detail_container #qq_no').text(memberData.qq_no);
            	$('#member_detail_container #weixin_no').text(memberData.weixin_no);
            	$('#member_detail_container #legal_name').text(memberData.legal_name);
            	$('#member_detail_container #legal_certificates_no').text(memberData.legal_certificates_no);
            	
            	$('#member_detail_container #btn_show_image').linkbutton({
            		iconCls: 'icon-reload',
            		text: '正在加载图片'
            	});
            	$('#member_detail_container #btn_show_image').linkbutton('disable');
            	$('#member_detail_container #btn_show_image').unbind('click');
            	
            	var imageInfo1 = {};
            	imageInfo1.image_id = memberData.image_contact_certificates_front;
            	imageInfo1.loaded = false;
            	imageInfo1.image_data = null;
            	imageInfo1.title = "联系人证件正面";
            	images[0] = imageInfo1;
            	
            	var imageInfo2 = {};
            	imageInfo2.image_id = memberData.image_contact_certificates_back;
            	imageInfo2.loaded = false;
            	imageInfo2.image_data = null;
            	imageInfo2.title = "联系人证件背面";
            	images[1] = imageInfo2;

            	var imageInfo3 = {};
            	imageInfo3.image_id = memberData.image_license;
            	imageInfo3.loaded = false;
            	imageInfo3.image_data = null;
            	imageInfo3.title = "工商营业执照";
            	images[2] = imageInfo3;

            	var imageInfo4 = {};
            	imageInfo4.image_id = memberData.image_legal_certificates_front;
            	imageInfo4.loaded = false;
            	imageInfo4.image_data = null;
            	imageInfo4.title = "法人证件正面";
            	images[3] = imageInfo4;

            	var imageInfo5 = {};
            	imageInfo5.image_id = memberData.image_legal_certificates_back;
            	imageInfo5.loaded = false;
            	imageInfo5.image_data = null;
            	imageInfo5.title = "法人证件背面";
            	images[4] = imageInfo5;
            	
				$.each(images, function(index, imageInfo) {
					$.loadImage(imageInfo.image_id, urlPrefix, {
						onSuccess: function(image) {
							images[index].image_data = image;
							images[index].loaded = true;
							imageLoadCount = imageLoadCount + 1;
							if (imageLoadCount == 5) {
								initImages();
							}
						},
						onNoImage: function() {
							images[index].image_data = "${pageContext.request.contextPath}/img/no_image.png";
							images[index].loaded = true;
							imageLoadCount = imageLoadCount + 1;
							if (imageLoadCount == 5) {
								initImages();
							}
						},
						onError: function(error) {
							images[index].image_data = "${pageContext.request.contextPath}/img/no_image.png";
							images[index].loaded = true;
							imageLoadCount = imageLoadCount + 1;
							if (imageLoadCount == 5) {
								initImages();
							}
						}
					});
				});
			},
			onAPIError : function(status, errors) {
			},
			onServerError : function(jqXHR, textStatus, errorThrown) {
			}
		},
		{
			param: JSON.stringify({
			    member_login_name: memberLoginName
			})
		});
	}
	
	function initImages() {
		var imageItems = new Array();
		$.each(images, function(index, image) {
			var imageItem = {};
			imageItem.src = image.image_data;
			imageItem.title = image.title;
			imageItems.push(imageItem);
		});
		
		$('#btn_show_image').linkbutton({
    		iconCls: 'icon-search',
    		text: '点击查看图片'
    	});
		$('#btn_show_image').linkbutton('enable');
		$('#btn_show_image').magnificPopup({
			items: imageItems,
			gallery: {
		        enabled: true
	        },
			type: 'image',
			callbacks: {
			    open: function() {
			        var magnificPopup = $.magnificPopup.instance;
					magnificPopup.bgOverlay.css('z-index', '10001');
					magnificPopup.wrap.css('z-index', '10002');
			    }
			}
		});
	}
});
</script>
<div id="member_detail_container">
  <table id="member_table" class="edit_table">
    <tr>
      <th width="100" height="24">会员登录名</th>
      <td colspan="3" height="24"><label id="member_login_name"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">企业名称</th>
      <td width="580" colspan="3" height="24"><label id="enterprise_name"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">企业性质</th>
      <td width="240" height="24"><label id="enterprise_property"></label></td>
      <th width="100" height="24">行业分类</th>
      <td width="240" height="24"><label id="enterprise_category"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">联系人</th>
      <td width="240" height="24"><label id="contact_name"></label></td>
      <th width="100" height="24">证件</th>
      <td width="240" height="24"><label id="contact_certificates_no"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">联系电话</th>
      <td width="240" height="24"><label id="telephone"></label></td>
      <th width="100" height="24">手机</th>
      <td width="240" height="24"><label id="mobile"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">电子邮件</th>
      <td colspan="3" height="24"><label id="email"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">QQ号码</th>
      <td width="240" height="24"><label id="qq_no"></label></td>
      <th width="100" height="24">微信号</th>
      <td width="240" height="24"><label id="weixin_no"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">法人姓名</th>
      <td width="240" height="24"><label id="legal_name"></label></td>
      <th width="100" height="24">证件</th>
      <td width="240" height="24"><label id="legal_certificates_no"></label></td>
    </tr>
    <tr>
      <th width="100" height="24">电子资质材料</th>
      <td colspan="3" height="24"><a id="btn_show_image" href="#" class="easyui-linkbutton" data-options="iconCls:'icon-reload', disabled:true">正在加载图片</a></td>
    </tr>
  </table>
</div>